<!-- *************
 *@description:左2图表
 *@author:rennan
 *@date: 2023-07-19 16:17:16
 *@version: V1.0.0
 ************ -->
 <template>
  <div id="L2_chart" style="height: 100%;"></div>
</template>

<script setup>
import { } from 'vue';
import { onMounted } from 'vue';
import { Pie } from '@antv/g2plot';
const data = [
  {
    type: '设备一',
    value: 20,
  },
  {
    type: '设备二',
    value: 80,
  },
];
let options={
  appendPadding: 10,
  data,
  angleField: "value",
  colorField: "type",
  color:['blue','#56CEA1'],
  radius: 0.8,
  label: {
    visible: true,
    type: "outer",
  },
  interactions: [{ type: "element-active" }],
};  
const left2=()=>{
  const piePlot = new Pie(document.getElementById('L2_chart'), options);
  piePlot.render();
};
onMounted(()=>{
    left2();
});

</script>

<style lang='scss' scoped></style>